<template>
  <view class="address-list">
	<view class="m-r-title">
		<navigator class="m-r-title-url" open-type="navigateBack"></navigator>
		<view class="m-r-title-title">选择地址</view>
	</view>
    <view class="list">
		<view style="background: #fff; font-size: 24rpx;color: #A3A3A3;text-align: center;padding-top: 12rpx;">
			<text>如需删除地址请在想删除的地址上长按后根据提示操作</text>
		</view>
      <view class="item"
	  :style="{backgroundColor: activeIndex === index? '#bebebe' : ''}"
		@longpress="touchlong(item)"
	   v-for="(item, index) in list" :key="item.adress_id" @click="select(item, index)">
        <view class="address">{{ item.adress + ' ' + item.detail }}</view>
        <view>
          <text class="name">{{ item.name }}</text>
          <text>{{ item.phone }}</text>
        </view>
      </view>
	  <view class="item" v-if="type === 'buyStart' " @click="select(false)">
	    <view class="address">不填写</view>
	    <view>
	      <text class="name"></text>
	      <text></text>
	    </view>
	  </view>
      <view class="item unable" v-for="(item, index) in unableList" :key="item.adress_id">
        <view class="address">{{ item.adress + ' ' + item.detail }}</view>
        <view>
          <text class="name">{{ item.name }}</text>
          <text>{{ item.phone }}</text>
        </view>
        <view class="unable-img"><image src="static/images/unable.png" mode="aspectFill"></image></view>
      </view>
    </view>
    <view class="bottom-btn" @click="addAddress"><text class="icon-jia1 iconfont"></text>添加常用地址</view>
  </view>
</template>

<script>
import RTitle from './components/r-title.vue'	
import common from '../../utils/common.js';
var app = getApp()
var _this = this
export default {
  name: 'AddressInput',
  components:{
	RTitle  
  },
  data () {
    return {
      list: [],
      cityId: '',
      unableList: [], // 不在配送范围的地址，以cityID区分
	  loop: null,
	  activeIndex: null,
	  type: ''
    }
  },
  onLoad (options) {
	  _this = this
    this.cityId = app.globalData.addressCityId
    this.getAddressList()
	this.type = options.type
  },
  methods: {
    select (item, index) {
		this.activeIndex = index
		console.log('zylaaaaa',app.globalData.shopAddress )
		if(app.globalData.addressType == 'buyStart'){
			app.globalData.shopAddress = {};
		}
		if(item) {
			console.log('zylbbbb',app.globalData.shopAddress )
			item.point = {
				lng: item.lng,
				lat: item.lat,
				formartLng: item.formartLng,
				formartLat: item.formartLat,
			}
			console.log(item);
			app.globalData[app.globalData.addressType] = item
			if(app.globalData.addressType == 'buyStart'){
				console.log(app.globalData.addressType);
				app.defaultBuyStart = false
				common.post("My&a=adressDefault",{adress_id:item.adress_id} , (res) => {
					
				})
			}
		}else {
			app.globalData[app.globalData.addressType] = ''
			if(app.globalData.addressType == 'buyStart'){
				app.defaultBuyStart = false
			}
		}
		
		/**/
		common.navigateBack()
    },
    // 获取地址列表
    getAddressList () {
		common.post('paotui&c=My&a=adress', { longlatType: 'gcj02', plugin: true }, (res) => {
			if (_this.cityId != '') {
			  res.forEach((item, index, arr) => {
			    item.city == _this.cityId ? _this.list.push(item) : _this.unableList.push(item)
			  })
			} else {
			  _this.list = res
			}
		})
    },
    addAddress () {
      app.globalData.addressInput = ''
	  uni.navigateTo({
	  	url: '/pages/runErrands/addAddress?back=2'
	  })
    },
	touchlong(item) {
		const self = this
		uni.showModal({
			title: '删除',
			content: '确定删除此地址吗',
			success(res) {
				self.activeIndex = null
				if(res.confirm) {
					common.post('My&a=del_adress', {
						adress_id: item.adress_id
					}, "getAddressList", self);
				}
			}
		})
	}
  }
}
</script>

<style lang="stylus" scoped>
	.address-list
		position relative
		background #f2f2f2
		padding-bottom 120rpx
		.list
			.item
				padding 12px 15px
				font-size 14px
				border-bottom 1PX solid #f4f4f4
				line-height 1.8
				color #666
				position relative
				background #fff
				&.unable
					background #f2f2f2
				&:last-child
					border-bottom none
				&>view
					ellipsis(1)
				.address
					color #000
					font-size 16PX
				.name
					margin-right 10px
				.unable-img
					position absolute
					right 15px
					top 0
					bottom 0
					z-index 2
					image
						height 80%
						margin-top 12%
						width 124rpx
		.bottom-btn
			position fixed
			z-index 999
			bottom 0
			left 0
			right 0
			background-color #FFFFFF
			font-size 16px
			text-align center
			height 50px
			line-height 50px
			border-top 1PX solid #ddd
			background #fff
			.iconfont
				color #04b7a5
				font-size 18px
				margin-right 5px
		.m-r-title {
			display: flex;
			align-items: center;
			height:178upx;
			padding:38upx 42upx 0;
			background-image: url('');
			background-position: center top;
			background-repeat: no-repeat;
			background-size: 100% 100%;
		}
		
		.m-r-title-url {
			width:27upx;
			height:47upx;
			background-image: url('');
			background-position: center;
			background-repeat: no-repeat;
			background-size: 100%;
		}
		
		.m-r-title-title {
			width:610upx;
			height:138upx;
			line-height: 138upx;
			text-align: center;
			font-size:18px;
			font-weight: bold;
			color:#fff;
		}
</style>
